<%--
  Created by IntelliJ IDEA.
  User: ZhengHQ
  Date: 2018-10-13
  Time: 0:47
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="shortcut icon" href="img/favicon.png">

    <title>登录</title>

    <!-- Icons -->
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/font-awesome.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/simple-line-icons.css">

    <!-- Main styles for this application -->
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/style.css">
    <style>
        .error{
            color:red;
        }
    </style>
</head>

<body class="app flex-row align-items-center">
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-8">
            <div class="card-group mb-0">
                <div class="card p-2">
                    <div class="card-block">
                        <form action="user!login.action" method="post" role="form"
                              class="form-horizontal" id="add-modal-form">
                            <h1>登录</h1>
                            <p class="text-muted">使用您的账户登录</p>
                            <p class="text-danger">${msg}</p>
                            <div class="input-group mb-1">
                                <span class="input-group-addon"><i class="icon-user"></i>
                                </span>
                                <input type="text" class="form-control" id="name" name="name" placeholder="用户名">
                            </div>
                            <div class="input-group mb-2">
                                <span class="input-group-addon"><i class="icon-lock"></i>
                                </span>
                                <input type="password" class="form-control" id="pwd" name="pwd" placeholder="密码">
                            </div>
                            <div class="row">
                                <div class="col-6">
                                    <button type="submit" class="btn btn-primary px-2">登录</button>
                                </div>
                                <div class="col-6 text-right hidden-sm-up">
                                    <a href="register.jsp" class="btn btn-primary px-2">注册</a>
                                </div>
                                <div class="col-6 text-right hidden-sm-down">
                                    <a href="findPassword.jsp" class="btn btn-link px-0">忘记密码?</a>
                                </div>
                            </div>
                            <br/>
                            <div class="row">
                                <div class="col-12 text-right hidden-sm-up">
                                    <a href="findPassword.jsp" class="btn btn-link px-0">忘记密码?</a>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="card card-inverse card-primary py-3 hidden-md-down" style="width:44%">
                    <div class="card-block text-center">
                        <div>
                            <h2>注册</h2>
                            <p>首次使用本系统的用户，请点击下面的按钮注册</p>
                            <a href="register.jsp" class="btn btn-primary active mt-1">注册</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Bootstrap and necessary plugins -->
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.validate.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/localization/messages_zh.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/tether.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/validate.js"></script>

</body>

</html>